import Vue from 'vue'
import VueRouter from 'vue-router'
import DashBoard from '@/components/DashBoard.vue'
import NProgress from 'nprogress'

Vue.use(VueRouter)

const routes = [{
        path: '/login',
        component: () =>
            import ('@/components/Login.vue'),
    },
    {
        path: '/user/:userId',
        component: () =>
            import ('@/components/User.vue'),
        meta: {
            name: '动态参数',
        },
        beforeEnter: (to, from, next) => {
            console.log('进入到 /user/:userId 所在路由的地方')
            next()
        },
    },
    {
        path: '/dashboard',
        component: DashBoard,
        name: 'Dashboard',
        children: [{
                path: '',
                component: () =>
                    import ('@/components/Home.vue'),
            },
            {
                path: 'userlist',
                component: () =>
                    import ('@/components/UserList.vue'),
            },
            {
                path: 'shoplist',
                component: () =>
                    import ('@/components/ShopList.vue'),
            },
        ],
    },
    {
        path: '/404',
        component: () =>
            import ('@/components/PageNotFound.vue'),
    },
    {
        path: '/',
        component: () =>
            import ('@/components/HelloWorld.vue'),
    },
]

const router = new VueRouter({
    routes,
})

let authorized = true


router.beforeEach((to, from, next) => {
    console.log('全局的前置的导航守卫执行了')
    console.log('from:', from)
    console.log('to:', to)
    NProgress.start()
    if (to.path != '/login' && !authorized) {
        next('/login')
    } else {
        next()
    }
})

router.afterEach((to, from) => {
    NProgress.done()
    console.log('全局后置的导航守卫结束了')
    console.log('from：', from)
    console.log('to：', to)
})
export default router